<template>
  <div>
    <div class="adminAside">
      <h3 class="mb-2">My Blog</h3>
      <el-col :span="24">
        <el-menu
            default-active="2"
            class="el-menu-vertical-demo"
            @open="handleOpen"
            @close="handleClose"
        >
          <el-menu-item index="1">
            <el-icon><img src="../assets/icon_admin/home.png"></el-icon>
            <b><span>首页</span></b>
          </el-menu-item>
          <el-sub-menu index="2">
            <template #title>
              <el-icon><img src="../assets/icon_admin/article.png"></el-icon>
              <b><span>文章管理</span></b>
            </template>
            <el-menu-item index="2-1">发布文章</el-menu-item>
            <el-menu-item index="2-2">文章列表</el-menu-item>
            <el-menu-item index="2-3">分类管理</el-menu-item>
            <el-menu-item index="2-4">标签管理</el-menu-item>
          </el-sub-menu>
          <el-sub-menu index="3">
            <template #title>
              <el-icon><img src="../assets/icon_admin/inform.png"></el-icon>
              <b><span>消息管理</span></b>
            </template>
            <el-menu-item index="3-1">评论管理</el-menu-item>
            <el-menu-item index="3-2">留言管理</el-menu-item>
          </el-sub-menu>
          <el-sub-menu index="4">
            <template #title>
              <el-icon><img src="../assets/icon_admin/userManager2.png"></el-icon>
              <b><span>用户管理</span></b>
            </template>
            <el-menu-item index="4-1">用户列表</el-menu-item>
            <el-menu-item index="4-2">在线用户</el-menu-item>
          </el-sub-menu>
        </el-menu>
      </el-col>
    </div>
    <div class="adminMain">
      <div class="topDiv">

      </div>
      <div class="bottomDiv">

      </div>
    </div>
  </div>
</template>

<script setup lang="ts">

</script>

<style scoped>
*{
  padding: 0px;
  margin: 0px;
}
.adminAside{
  width: 200px;
  height: 100vh;
  border: #888888 solid 2px;
  margin-right: 10px;
  border-radius:15px;
  float: left;

  text-align: center;
  color: #9a8791;
}
.adminMain{
  width: calc(100vw - 234px);
  height: 100vh;
  float: left;
}
.topDiv{
  width: calc(100vw - 234px);
  height: 120px;
  border: #888888 solid 2px;
  margin-bottom: 10px;
  border-radius:15px;
}
.bottomDiv{
  width: calc(100vw - 234px);
  height: calc(100vh - 134px);
  border: #888888 solid 2px;
  border-radius:15px;
}
</style>